<template>
  <a-spin :spinning="confirmLoading">
    <j-form-container :disabled="formDisabled">
      <!-- 主表单区域 -->
      <a-form :form="form" slot="detail">
        <a-row>
          <a-col :span="24">
            <p>
              <a-divider orientation="left">• 发票信息</a-divider>
            </p>
          </a-col>
        </a-row>
        <a-row>
          <a-col :span="12" >
            <a-form-item label="发票代码" :labelCol="labelCol" :wrapperCol="wrapperCol">
              <a-input v-decorator="['invoiceCode']" ></a-input>
            </a-form-item>
          </a-col>
          <a-col :span="12" >
            <a-form-item label="发票号码" :labelCol="labelCol" :wrapperCol="wrapperCol">
              <a-input v-decorator="['invoiceNo']" ></a-input>
            </a-form-item>
          </a-col>
          <a-col :span="12" >
            <a-form-item label="任务数量" :labelCol="labelCol" :wrapperCol="wrapperCol">
              <a-input v-decorator="['num']" ></a-input>
            </a-form-item>
          </a-col>
          <a-col :span="12" >
            <a-form-item label="价税合计" :labelCol="labelCol" :wrapperCol="wrapperCol">
              <a-input v-decorator="['invoiceJe']" ></a-input>
            </a-form-item>
          </a-col>
          <a-col :span="12" >
            <a-form-item label="税率" :labelCol="labelCol" :wrapperCol="wrapperCol">
              <a-input v-decorator="['tax']" ></a-input>
            </a-form-item>
          </a-col>
           <a-col :span="12" >
             <a-form-item label="税额" :labelCol="labelCol" :wrapperCol="wrapperCol">
               <a-input v-decorator="['invoiceSe']" ></a-input>
             </a-form-item>
           </a-col>
           <a-col :span="12" >
            <a-form-item label="金额" :labelCol="labelCol" :wrapperCol="wrapperCol">
              <a-input v-decorator="['jshj']" ></a-input>
            </a-form-item>
            </a-col>
            <a-col :span="12" >
              <a-form-item label="纳税人名称" :labelCol="labelCol" :wrapperCol="wrapperCol">
               <a-input v-decorator="['creditName']" ></a-input>
              </a-form-item>
            </a-col>
             <a-col :span="12" >
               <a-form-item label="纳税人识别号" :labelCol="labelCol" :wrapperCol="wrapperCol">
                 <a-input v-decorator="['creditCode']" ></a-input>
               </a-form-item>
             </a-col>
              <a-col :span="12" >
                <a-form-item label="个体户姓名" :labelCol="labelCol" :wrapperCol="wrapperCol">
                   <a-input v-decorator="['traname']" ></a-input>
                </a-form-item>
              </a-col>
        </a-row>
        <a-row>
          <a-col :span="24">
            <p>
              <a-divider orientation="left">• 业务及收款信息</a-divider>
            </p>
          </a-col>
        </a-row>
      </a-form>
    </j-form-container>
  <a-modal
               title="查看验收单"
               :visible="visibleHz"
               width="1200px"
               cancelText="关闭"
               @cancel="HzClose"
         >
                          <div  id="hz" style="width:1160px;height:475px;overflow-y:auto;">

                             <iframe style="width: 100%;height: 100%;" :src="hzImgUrl"></iframe>
                          </div>

                           <template slot="footer">
                                <a-button @click="HzClose">关闭</a-button>
                              </template>

                        </a-modal>

      <!-- 子表单区域 -->
    <a-table
           ref="table"
           size="middle"
           :scroll="{x:true}"
           bordered
           rowKey="id"
           :columns="columns"
           :dataSource="dataSource"
           class="j-table-force-nowrap"
          >
           <template slot="htmlSlot" slot-scope="text">
             <div v-html="text"></div>
           </template>
           <template slot="imgSlot" slot-scope="text">
             <span v-if="!text" style="font-size: 12px;font-style: italic;">无图片</span>
             <img v-else :src="getImgView(text)" height="25px" alt="" style="max-width:80px;font-size: 12px;font-style: italic;"/>
           </template>
           <template slot="fileSlot" slot-scope="text">
             <span v-if="!text" style="font-size: 12px;font-style: italic;">无文件</span>
             <a-button
               v-else
               :ghost="true"
               type="primary"
               icon="download"
               size="small"
               @click="downloadFile(text)">
               下载
             </a-button>
           </template>
            <span slot="action" slot-scope="text, record">
                     <a @click="pdf(record)">预览</a>
             </span>
         </a-table>
  </a-spin>



</template>

<script>

  import pick from 'lodash.pick'
  import { getAction } from '@/api/manage'
  import { FormTypes,getRefPromise } from '@/utils/JEditableTableUtil'
  import { JEditableTableMixin } from '@/mixins/JEditableTableMixin'
  import { validateDuplicateValue } from '@/utils/util'
  import JFormContainer from '@/components/jeecg/JFormContainer'
  import JImageUpload from '@/components/jeecg/JImageUpload'
  import pdf from 'vue-pdf'

  export default {
    name: 'LhygInvoiceForm',
    mixins: [JEditableTableMixin],
    components: {
      JFormContainer,
      JImageUpload,
      pdf
    },
    data() {
      return {
        model:{},
        visibleHz:false,
        hzImgUrl:'',
        labelCol: {
          xs: { span: 24 },
          sm: { span: 6 },
        },
        wrapperCol: {
          xs: { span: 24 },
          sm: { span: 16 },
        },
        labelCol2: {
          xs: { span: 24 },
          sm: { span: 3 },
        },
        wrapperCol2: {
          xs: { span: 24 },
          sm: { span: 20 },
        },

        // 发票项目明细表

          dataSource: [],
          columns: [
            {
              title: '项目单号',
              align:"center",
              dataIndex:'billno'
            },
            {
              title: '任务金额',
              align:"center",
              dataIndex:'bmoney'
            },

            {
              title: '银行收款',
              align:"center",
              dataIndex:'bankMoney'
            },
            {
              title: '个体户到账时间',
              align:"center",
              dataIndex:'gtdztime'
            },
            {
              title: '银行流水号',
              align:"center",
              dataIndex:'bankno'
            },
            {
              title: '合同编号',
              align:"center",
              dataIndex:'contractNo'
            },
            {
              title: '验收单号',
              align:"center",
              dataIndex:'annexNo'
            },
            {
              title: '验收单',
              align:"center",
              dataIndex: 'action',
              scopedSlots: { customRender: 'action' }

            },
          ],
        url: {
          add: "/gsinvoice/lhygRegInvoice/add",
          edit: "/gsinvoice/lhygRegInvoice/edit",
          queryById: "/gsinvoice/lhygRegInvoice/queryById",

        }
      }
    },
    props: {
      //流程表单data
      formData: {
        type: Object,
        default: ()=>{},
        required: false
      },
      //表单模式：false流程表单 true普通表单
      formBpm: {
        type: Boolean,
        default: false,
        required: false
      },
      //表单禁用
      disabled: {
        type: Boolean,
        default: false,
        required: false
      }
    },
    computed: {
      formDisabled(){
        if(this.formBpm===true){
          if(this.formData.disabled===false){
            return false
          }
          return true
        }
        return this.disabled
      },
      showFlowSubmitButton(){
        if(this.formBpm===true){
          if(this.formData.disabled===false){
            return true
          }
        }
        return false
      }
    },
    created () {
      //如果是流程中表单，则需要加载流程表单data
      this.showFlowData();
    },
    methods: {
      addBefore(){
        this.form.resetFields()
        this.dataSource=[]
      },
      getAllTable() {
        let values = this.tableKeys.map(key => getRefPromise(this, key))
        return Promise.all(values)
      },
      /** 调用完edit()方法之后会自动调用此方法 */
      edit(record) {
       this.model = Object.assign({}, record);
        let fieldval = pick(this.model,'traname','creditCode','creditName','industryCode','invoiceType','invoiceCode','invoiceNo','invoiceJe','invoiceSe','tax','taxOffice','orderNo','goodsName','status','message')
        this.$nextTick(() => {
          this.form.setFieldsValue(fieldval)
          this.form.setFieldsValue({jshj:this.model.invoiceJe - this.model.invoiceSe})
          this.form.setFieldsValue({tax:Number(this.model.tax*100).toFixed()+"%"})
        })
        // 加载子表数据
        if (this.model.id) {
          let params = { invoiceid: this.model.id

          }
          getAction("/gsinvoice/lhygRegInvoice/detail",params).then(res=>{
            this.loading = false;
            if(res.success){
               this.dataSource = res.result.records
               this.form.setFieldsValue({num:res.result.total})
            }else{
             this.$message.warning(res.message)
            }
             }
          )
        }
      },
      pdf(record){
        let that = this;
        that.hzImgUrl = record.annex;
        that.visibleHz = true
      },

       HzClose(){
           this.visibleHz = false;
       },
      /** 整理成formData */
      classifyIntoFormData(allValues) {
        let main = Object.assign(this.model, allValues.formValue)
        return {
          ...main, // 展开
          lhygInvoiceProList: allValues.tablesValue[0].values,
        }
      },
      //渲染流程表单数据
      showFlowData(){
        if(this.formBpm === true){
          let params = {id:this.formData.dataId};
          getAction(this.url.queryById,params).then((res)=>{
            if(res.success){
              this.edit (res.result);
            }
          })
        }
      },
      validateError(msg){
        this.$message.error(msg)
      },
     popupCallback(row){
       this.form.setFieldsValue(pick(row,'fphm','fpdm','fpys','gfmc','gfkhh','gfzh','gfnsrsbh','gfdzdh','xfmc','xfkhh','xfzh','xfnsrsbh','xfdzdh','fpnr','kpzje','sl','se','yjdz','kpr','fptp','createBy','createTime'))
     },

    }
  }
</script>

<style scoped>
</style>